<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html ng-app="centerdevices">

	<head>
		<meta charset="utf-8" />
		<title>广东海洋大学(大学物理实验)-实验中心</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="css/bootstrap.css" />
		<link rel="stylesheet" type="text/css" href="css/bootstrap-responsive.css" />
		<script src="js/jquery-2.0.0.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/angular.min.js" type="text/javascript" charset="utf-8"></script>
	</head>

	<body>
		<div class="container">
			<div class="row">
				<div class="span12">
					<div class="navbar navbar-inverse">
						<div class="navbar-inner">
							<div class="container-fluid">
								<a class="brand visible-phone" href="index.html">大学物理实验中心（实验设备）</a>
								<a class="brand hidden-phone" href="index.html">物理实验中心（实验设备）</a>
							</div>
						</div>

					</div>
					<h3>
						中心设备一览表
					</h3>
					<div ng-controller="getAllDevices">
						<table class="table table-striped table-hover table-bordered">
							<tr>
								<th>
									序号
								</th>
								<th>
									设备名称
								</th>
								<th>
									型号/规格
								</th>
								<th>
									单价/原价
								</th>
								<th>
									数量(台/套)
								</th>
								<th>
									购置日期
								</th>
							</tr>
							<tr ng-repeat="x in devs" >
								<td>{{$index+1}}</td>
								<td>{{x.devname}}</td>
								<td>{{x.devtype}}</td>
								<td>{{x.devpriv}}</td>
								<td>{{x.devnums}}</td>
								<td>{{x.devdate}}</td>
							</tr>
						</table>
					</div>
				</div>
			</div>
			<div class="row" style="margin-top: 18px;">
				<div class="span2">

				</div>
				<div class="span4 hidden-phone">
					<div class="media">
						<a class="pull-left" href="#">
							<img style="height: 45px;" class="media-object img-circle " src="img/logo.jpg" alt='' />
						</a>
						<div class="media-body">
							<h4 class="media-heading">
								理学院
							</h4> 大学物理实验中心(实验模块)
						</div>
					</div>
				</div>
				<div class="span6">
					<address style="margin-top: -18px;"><strong>广东海洋大学, 理学院.</strong><br /> 广东省湛江市麻章区湖光岩东海大路1号<br /> 邮箱:lxy@gdou.edu.cn<br /> 电话:(0759) 2383636</address>
				</div>
			</div>
		</div>

	</body>

</html>
<!--
	作者：1173626291@qq.com
	时间：2016-05-15
	描述：使用angjs进行数据的获取
-->
<script>
	var app=angular.module("centerdevices",[]);
	app.controller("getAllDevices",function($scope,$http){
		$http.get("js/data.json").success(function(response){
			$scope.devs=response;
		});
	});
</script>